<template>
  <div>
    <el-dialog v-model="dialogFormVisible" @close="closeDialog" title="选择用户" :close-on-click-modal="false" v-on:open="onSubmit">
      <el-table
        ref="multipleTable"
        :data="page.list"
        @selection-change="handleSelectionChange"
        style="width: 100%">
        <el-table-column
          type="selection"
          width="55">
        </el-table-column>
        <el-table-column
          type="index"
          label="序号"
          width="80">
        </el-table-column>
        <el-table-column
          prop="account"
          label="账户">
        </el-table-column>
        <el-table-column
          prop="name"
          label="姓名">
        </el-table-column>
        <el-table-column
          prop="siteName"
          label="中心">
        </el-table-column>
      </el-table>
      <el-row :gutter="20">
        <el-col :span="16">
          <div>
            <el-pagination
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="page.pageNumber"
              :page-sizes="[10, 20, 30]"
              :page-size="10"
              layout="total, prev, pager, next, jumper"
              :total="page.totalRow">
            </el-pagination>
          </div>
        </el-col>
        <el-col :span="8">
          <div class="pull-right" style="padding:10px;">
            <el-button type="primary" @click.native.prevent="handleSubmit">确定</el-button>
            <el-button @click.native.prevent="closeDialog">取消</el-button>
          </div>
        </el-col>
      </el-row>
    </el-dialog>
  </div>
</template>

<script>
  import http from '../../../api/http'
  export default {
    data () {
      return {
        userData: [],
        userstotalcount: 0,
        multipleSelection: [],
        form: {
          pageNo: 1,
          pageSize:10,
          filter: {
            kwd: '',
            sort: {create_datetime: 'desc'},
            fieldList: [{field: 'siteId', exp: '=', val: ''}]
          },
        },
        loading: true,
        page: {}
      }
    },
    props: {
      dialogFormVisible: {
        type: Boolean,
        default: false
      },siteId:{
          type:String
      }
    },
    methods: {
      onSubmit () {
        var vm = this
        vm.loading = true;
        vm.form.filter.fieldList[0].val = vm.siteId;
        http.postData(vm, "/sys/account/page", {
          json: JSON.stringify(vm.form.filter),
          pageNo: vm.form.pageNo,
          pageSize: vm.form.pageSize
        }, function (resp) {
          var ret = resp.body;
          if (ret.code == '111') {
            vm.page = ret.value;
          }
          vm.loading = false;
        });
      },
      handleSizeChange () {
        this.form.pageNo = 1
        this.onSubmit()
      },
      handleCurrentChange (val) {
        this.form.pageNo = val
        this.onSubmit()
      },
      handleSelectionChange (val) {
        this.multipleSelection = val;
      },
      closeDialog () {
        this.$parent.closeAccountDialog();
      },
      handleSubmit() {
        var vm = this;
        if(vm.multipleSelection.length) {
          vm.$parent.selectedAccounts(vm.multipleSelection);
          vm.$refs.multipleTable.clearSelection();
          vm.closeDialog();
        }else {
          vm.$message.error('没有勾选项,请确认您的选择')
        }
      }
    },
    created () {
//      this.onSubmit()

    }
  }
</script>
